<template>
  <div class="shdxq">
    <div class="shtop">
      <el-card class="box-card">
       <a class="shu"></a> 售后单详情:
        <div style="display: flex;  padding-top:2vh">
          <div style="flex: 1;">
            售后单编号：
            <a style="padding-left: 6px; margin-right: 10px;">6666</a>
          </div>
          <div style="flex: 1;">
            <a style="margin-right: 10px;">售后单类型: xx</a>
          </div>
          <div style="flex: 1;">
            <a style="margin-right: 10px;">退货提交时间: xx</a>
          </div>
          <div style="flex: 1;">
            <a>退货商品名称: xx</a>
          </div>
        </div>
        <div style="display: flex;  padding-top:2vh">
          <div style="flex: 1;">
            退货商品数量:
            <a style="padding-left: 6px; margin-right: 10px;">6666</a>
          </div>
          <div style="flex: 1;">
            <a style="margin-right: 10px;">退货原因: xx</a>
          </div>
          <div style="flex: 1;">
            <a style="margin-right: 10px;">退货规格描述: xx</a>
          </div>
          <div style="flex: 1;">
            <a>退货商品ID: 1</a>
          </div>
        </div>
        <div style="display: flex;  padding-top:2vh">
          <div style="flex: 0.5;">
            退货商品金额:
            <a style="padding-left: 6px; margin-right: 10px;">6666</a>
          </div>
          <div style="flex: 0.5;">
            <a style="margin-right: 10px;">备注: xx</a>
          </div>
          <div style="flex: 1;">
            <a style="margin-right: 10px;">退货凭证: xx</a>
          </div>
        </div>
        <div style="display: flex; justify-content: center; padding-top: 5vh; padding-left: 20vh;">
          <div style="flex: 30;">
            <el-steps :space="600" :active="1" finish-status="success">
              <el-step title="已申请"></el-step>
              <el-step title="待退货"></el-step>
              <el-step title="已退货"></el-step>
              <el-step title="已完成"></el-step>
            </el-steps>
          </div>
        </div>
      </el-card>
    </div>
    <div class="shcenter" style="margin-top:3vh">
      <el-card class="box-card">
      <a class="shu">.</a>  商家收货人信息:
        <div style="display: flex;  padding-top:2vh">
          <div style="flex: 0.5;">
            收货人:
            <a style="padding-left: 6px; margin-right: 10px;">6666</a>
          </div>
          <div style="flex: 0.5;">
            <a style="margin-right: 10px;">手机号码: xx</a>
          </div>
          <div style="flex: 0.5;">
            <a style="margin-right: 10px;">收货地址: xx</a>
          </div>
        </div>
      </el-card>
    </div>
    <div class="shcenter2" style="margin-top:3vh">
      <el-card class="box-card">
      <a class="shu"></a>  订单基本信息:
        <div style="display: flex;  padding-top:2vh">
          <div style="flex: 1;">
            订单类型:
            <a style="padding-left: 6px; margin-right: 10px;">6666</a>
          </div>
          <div style="flex: 1;">
            <a style="margin-right: 10px;">订单业务类型: xx</a>
          </div>
          <div style="flex: 1;">
            <a style="margin-right: 10px;">支付方式: xx</a>
          </div>
          <div style="flex: 1;">
            <a style="margin-right: 10px;">订单状态: xx</a>
          </div>
        </div>
        <div style="display: flex;  padding-top:2vh">
          <div style="flex: 1;">
            商品ID:
            <a style="padding-left: 6px; margin-right: 10px;">6666</a>
          </div>
          <div style="flex: 1;">
            <a style="margin-right: 10px;">商品类型: xx</a>
          </div>
          <div style="flex: 1;">
            <a style="margin-right: 10px;">数量: xx</a>
          </div>
          <div style="flex: 1;">
            <a style="margin-right: 10px;">商品一级分类: xx</a>
          </div>
        </div>
        <div style="display: flex;  padding-top:2vh">
          <div style="flex: 1;">
            商品二级分类:
            <a style="padding-left: 6px; margin-right: 10px;">6666</a>
          </div>
          <div style="flex: 1;">
            <a style="margin-right: 10px;">商品价格: xx</a>
          </div>
          <div style="flex: 1;">
            <a style="margin-right: 10px;">支付状态: xx</a>
          </div>
          <div style="flex: 1;">
            <a style="margin-right: 10px;">用户ID: xx</a>
          </div>
        </div>
        <div style="display: flex;  padding-top:2vh">
          <div style="flex: 1;">
            支付金额:
            <a style="padding-left: 6px; margin-right: 10px;">1</a>
          </div>
        </div>
      </el-card>
    </div>
    <div class="shcenfoot" style="margin-top:3vh">
      <el-card class="box-card">
      <a class="shu"></a>  物流信息:
        <div style="display: flex;  padding-top:2vh">
          <div style="flex: 0.25;">
            物流公司名称:
            <a style="padding-left: 6px; margin-right: 10px;">6666</a>
          </div>
          <div style="flex: 0.25;">
            <a style="margin-right: 10px;">物流单号: xx</a>
          </div>
          <div style="flex: 0.2;">
            <a style="margin-right: 10px;">
              <el-button type="primary">查看物流详情</el-button>
            </a>
          </div>
        </div>
        <div
          style="display: flex; justify-content: center; align-items: center; text-align: center; padding-top:5vh;"
        >
          <div style="flex: 0.25;">
            <el-button type="primary" plain style="width:px">关闭</el-button>
          </div>
        </div>
      </el-card>
    </div>
  </div>
</template>

<script>
export default {};
</script>

<style scoped>
.shu{
     position: absolute;
     left: -0.3px;
     color:rgb(0, 149, 255);
     background-color: rgb(0, 149, 255);
     height: 30px;
     width: 8px;
}
</style>